伙计们，

我有一个可重用的组件，它通过将键名作为字符串或绑定的 var 将键翻译成一种选择的语言。

通常我为此使用标签，但由于不同的原因，我将当前翻译切换/替换为 {t('...')}。

这是组件的代码：

import React from 'react';

import { useTranslation as defaultTranslation } from 'react-i18next';

import i18next from 'i18next';

export const useTranslation = (ns = 'common', options) => {

  return defaultTranslation(ns, {

    useSuspense: false,

    ...options,

  });

};

export const withTranslation = (Component, ns, options) => {

  const TranslatedHOC = (props) => {

    const translationProps = useTranslation(ns, options);

    return ;

  };

  return TranslatedHOC;

};

export const getCurrentLanguage = () =>

  i18next.language || localStorage.getItem('language') || 'de-DE';

首先，我为使用的导入函数定义常量：

const {t} = useTranslation();

正常情况：在文件中导入我的组件，我想在其中使用它并在上面添加代码。

我的组件代码，我想在其中替换标签。

// Import React Table

import ReactTable from 'react-table';

import 'react-table/react-table.css';

import LocalizedText from '@components/i18n/LocalizedText';

class T extends React.Component {

  constructor(props) {

    super(props);

    this.state = {

      data: [],

      pages: null,

      loading: true,

    };

    this.fetchData = this.fetchData.bind(this);

  }

  fetchData(state, instance) {

    this.props.onFetchData(state, instance).then(() => {

      this.setState({

        loading: false,

      });

    });

  }

  render() {

    return (